<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>border-style:double</title>
</head>
<body>
	<style type="text/css" scoped>
		body{
			margin:0;
		}
		.border {
			width:100px;
			height:100px;
			margin:20px 20px;
		}
		.border-1{
			border:1px double;
		}
		.border-2{
			border:2px double;
		}
		.border-3{
			border:3px double;
		}
		.border-menu{
			border-top: 60px double;
			height: 20px;
			width:120px;
			border-bottom:20px solid;
		}
		
		.box{
			
			width: 150px;
			height: 150px;
			overflow:hidden;
			margin:20px;
			color:#fff;
			position: relative;
			line-height:150px;
			font-size: 22px;
			text-align: center;
			border:2px solid #c00000;
		}
		.border-circle{
		    z-index: -1;
		    position: absolute;
		    width: 150px;
		    border: 150px dotted #c00000;
		    height: 150px;
		}
	</style>
	<div class="border border-1">
		
	</div>

	<div class="border border-2">
		
	</div>

	<div class="border border-3">
		
	</div>


	<div class="border border-menu">
		
	</div>
	
	<div class="box">
		<div class="border-circle"></div>
		美女
	</div>
</body>
</html>